<template>
  <div class="container">
    <div class="currentTime">
      <div class="time">
        <span class="dateTime">{{date}}</span> 
        <span class="secondTime">{{time}}</span>
      </div>
    </div>
    <el-row>
      <BusinessManagement ref="business" />
      <GovService />
    </el-row>
  </div>
</template>

<script>
import GovService from './components/gov-service.vue' // 青岛市政务服务分布图
import BusinessManagement from './components/business-management.vue' // 青岛市民中心业务办理数据统计
import moment from 'moment'

export default {
  name: 'index2',
  components: {
    GovService,
    BusinessManagement,
  },
  data () {
    return {
      date: moment().format('YYYY年MM月DD日'),
      time: moment().format('HH:mm:ss')
    }
  },
  created(){
    // 获取Promise对象的值
    let jumpTmFun = this.GLOBAL.getJumpTime()
    jumpTmFun.then(resData =>{
      if (resData.data > 0) {
        // 1.5分钟后跳转到index2大屏
        setTimeout(() => {
          this.$router.push({ path: '/index1' })
        }, 1000 * resData.data)
      }
    })
  },
  mounted() {
    // 20分钟后跳转到index大屏
    // setTimeout(() => {
    //   this.$router.push({ path: '/' })
    // }, 1000 * 60 * 1.5)
    this.dateTimeChange()
  },
  // 缓存进入此页面时执行的方法
  activated() {
    // 获取大厅接待情况数据
    // this.$refs.business.getDtjd()
    // 获取Promise对象的值
    let jumpTmFun = this.GLOBAL.getJumpTime()
    jumpTmFun.then(resData =>{
      if (resData.data > 0) {
        // 1.5分钟后跳转到index2大屏
        setTimeout(() => {
          this.$router.push({ path: '/index1' })
        }, 1000 * resData.data)
      }
    })
  },
  methods: {
    dateTimeChange () {
      var b = setInterval(() => {
        this.time = moment().format('HH:mm:ss')
        clearInterval(b)
        this.dateTimeChange()
      }, 1000)
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.container {
  width: 5760px;
  height: 1080px;
  background: #050f3b;
  padding: 40px 35px;
  .currentTime {
    width: 4000px;
    position: absolute;
    margin: -15px auto 0;
    padding-right: 108px;
    box-sizing: border-box;
    left: 0;
    right: 0;
    text-align: center;
      .time{
        font-size: 40px;
        font-weight: 700;
        font-family: 微软雅黑;
      .dateTime{
        padding-right:10px;
      }
      .secondTime{
        padding-left:15px;
      }
    }
  }
}
</style>